<template>
  <BoTable :columns="columns" :request="fetchList">
    <template #toolbars>
      <Button @click="onAdd">新增</Button>
    </template>
  </BoTable>

  <FormModal></FormModal>
</template>

<route lang="json">
{
  "meta": {
    "title": "项目类型管理"
  }
}
</route>
<script setup lang="tsx">
import { computed } from 'vue';
import { useFormModal } from '@boeyo/hooks';
import { BoTable, BoTableProps } from '@boeyo/ui';
import { Button, Switch } from 'ant-design-vue';
import { useRouter } from 'vue-router';
import { fetchList } from './api';

const router = useRouter();

const columns = computed<BoTableProps['columns']>(() => {
  return [
    {
      title: '项目类型',
      dataIndex: 'projectType',
    },
    {
      title: '是否启用',
      dataIndex: 'enable',
      customRender(opt) {
        return <Switch></Switch>;
      },
    },
    {
      title: '说明',
      dataIndex: 'remark',
      hideInSearch: true,
    },
    {
      title: '说明',
      dataIndex: 'remark',
      valueType: 'dateRange',
    },
    {
      title: '操作',
      dataIndex: 'actions',
      actions(opt) {
        return [
          {
            text: '编辑',
            onClick(record) {
              console.log('编辑');
            },
          },
          {
            text: '删除',
            onClick(record) {
              console.log('编辑');
            },
          },
        ];
      },
    },
  ];
});

const { FormModal, open } = useFormModal({
  size: 'small',
});

const onAdd = () => {
  open({
    title: '新增',
    items: [],
    request: function (params: any): Record<string, any> {
      throw new Error('Function not implemented.');
    },
  });
};
</script>
